import React from 'react'
import { NavBar, Space, Toast } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
import { Card, Button } from 'antd-mobile'
import request from '../../api/request'

function Index() {
    const back = useNavigate()
    let id = Date.now()
    let title = '高铁票'
    let price = 667
    // 支付
    const pay = async () => {
        const res = await request.get('/api/pay', {
            params: {
                id,
                title,
                price
            }
        })
        const { code, data } = res.data
        if (code == 200) {
            window.location.href = data
        }
    }
    return (
        <div>
            <NavBar onBack={() => back(-1)}>订单详情</NavBar>

            <div className='pp'>
                <h3>订单详情</h3>
                <span>等待支付</span>
                <span>作息已锁定,请在00:29:59内完成</span>
            </div>

            <h4>订单编号:E3648945694849</h4>

            <div className='pp'>
                <div style={{ height: '90px' }}>
                    <p>05月13日  周一</p>
                </div>
                <h2>21:03</h2>
                <span>合肥南</span>
                <span>1h12m</span>
                <span>D3212</span>
                <h2>21:03</h2>
                <span>合肥南</span>
            </div>

            <div>
                <Card title='郑子豪  成人票 超级会员'>
                    <p>身份证  155688********2322...............................￥333.5</p>
                    <p>二等座  01车07c号 ...................................................已出票</p>
                </Card>

                <Card title='郑子豪  成人票 超级会员'>
                    <p>身份证  155688********2322...............................￥333.5</p>
                    <p>二等座  01车07c号 ...................................................已出票</p>
                </Card>

                <Card title='温馨提示'>
                    <p>1.12306预订暂不支持余额抵扣，超级会员用户返现将在发车次日统一返还至时间钱包中</p>
                    <p>2.为避免改签，退票失败，请尽量距发车35分钟提交申请，始发地为香港西九龙请距发车65分钟前提交申请</p>
                    <p>3.支付订单，表示您已阅读并同意《火车票信息服务协议》</p>
                </Card>
            </div>



            <div className='aa'>
                <Button shape='default' color='primary'>
                    取消订单
                </Button>
                <Button shape='default' color='primary' onClick={() => pay()}>
                    支付订单
                </Button>
            </div>
        </div>
    )
}

export default Index
